<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	<style>
		.active{
			background:yellowgreen;
			}
		 div{
		 	display:none;
		 	width: 200px;
		 	height: 200px;
		 	border: 1px solid black;
		 	}
		.show{
			display:block;
			}
    </style>
</head>
<body>
		<input type="button" value="tab1" class="active">
		<input type="button" value="tab2">
		<input type="button" value="tab3">
		<div class="show">div1</div>
		<div>div2</div>
		<div>div3</div>
     <script>
			var oTab=document.getElementsByTagName('input');
			var oDiv=document.getElementsByTagName('div');
			
			for(let i=0;i<oTab.length;i++){
				oTab[i].onclick=function()
				{
					for(var j=0;j<oTab.length;j++){
						oTab[j].className=' ';
						oDiv[j].className=' ';
					}
					this.className='active';
					oDiv[i].className='show';
				}
			}
   </script>
</body>
</html>
